<template>
    <div class="filter">
        <div class="filter-item">
            <label for="">所属单位：</label>
            <el-select
                v-model="searchForm.depId"
                class="m-2"
                placeholder="请选择所属单位"
                style="width: 145px"
                :disabled="localTypeUnit != '1'"
                @change="depIdChange"
            >
                <el-option
                    v-for="item in depIdList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">设备分类：</label>
            <el-input
                v-model="searchForm.facilitySort"
                placeholder="请输入设备分类"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备地点：</label>
            <el-input
                v-model="searchForm.facilityLocations"
                placeholder="请输入设备地点"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备名称：</label>
            <el-input
                v-model="searchForm.facilityName"
                placeholder="请输入设备名称"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备唯一识别码：</label>
            <el-input
                v-model="searchForm.facilityNumber"
                placeholder="请输入设备唯一识别码"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">设备状态：</label>
            <el-select
                v-model="searchForm.facilityState"
                class="m-2"
                placeholder="请选择设备状态"
                style="width: 145px"
            >
                <el-option
                    v-for="item in facilityStateList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">设备分级：</label>
            <el-select
                v-model="searchForm.facilityLevel"
                class="m-2"
                placeholder="请选择设备分级"
                style="width: 145px"
            >
                <el-option
                    v-for="item in facilityLevelList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <label for="">规格型号：</label>
            <el-input
                v-model="searchForm.specificationModel"
                placeholder="请输入规格型号"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">供应商/厂家：</label>
            <el-input
                v-model="searchForm.facilitySupplier"
                placeholder="请输入供应商/厂家"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">资产编号：</label>
            <el-input
                v-model="searchForm.assetNumber"
                placeholder="请输入资产编号"
                style="width: 145px"
            />
        </div>
        <div class="filter-item">
            <label for="">巡检计划：</label>
            <el-select
                v-model="searchForm.hasInspPlan"
                class="m-2"
                placeholder="请选择巡检计划"
                style="width: 145px"
            >
                <el-option
                    v-for="item in inspectionPlanList"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                />
            </el-select>
        </div>

        <div class="filter-item">
            <label for="">标签名称：</label>
            <el-select
                v-model="searchForm.tagName"
                class="m-2"
                placeholder="请选择标签名称"
                style="width: 145px"
                clearable
            >
                <el-option
                    v-for="item in labelList"
                    :key="item.tagName"
                    :label="item.tagName"
                    :value="item.tagName"
                />
            </el-select>
        </div>
        <div class="filter-item">
            <el-button
                type="primary"
                @click="search"
            >查询</el-button>
        </div>
        <div class="filter-item">
            <el-button
                type="primary"
                @click="reset"
            >重置</el-button>
        </div>
    </div>
    <div class="options">
        <div class="overview">
            <!-- 设备概括 -->
            <el-tag class="ml-2">设备总数({{ equipmentOverview.total }})</el-tag>
            <el-tag
                class="ml-2"
                type="success"
            >正常({{ equipmentOverview.useCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="info"
            >备用({{ equipmentOverview.standbyCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="warning"
            >维修({{ equipmentOverview.repairCount }})</el-tag>
            <el-tag
                class="ml-2"
                type="danger"
            >已报废({{ equipmentOverview.scrapCount }})</el-tag>
        </div>
        <div>
            <el-button
                type="primary"
                @click="exportInspRecordList"
            >
                批量导出
            </el-button>
        </div>
    </div>
    <div class="dataList">
        <el-table
            ref="singleTableRef"
            :data="dataList"
            style="width: 100%"
            @current-change="handleCurrentChange"
            border
            size="small"
            :height="hHeight - 40 + 'px'"
        >
            <el-table-column
                type="index"
                label="序号"
                width="55"
                align="center"
            />
            <el-table-column
                label="所属单位"
                prop="depId"
                align="center"
                width="72"
            >
                <template #default="scope">
                    <div>{{ depIdName(scope.row.depId) }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="设备名称"
                prop="facilityName"
                align="center"
                width="122"
            />
            <el-table-column
                label="设备分类"
                prop="facilitySort"
                align="center"
                width="72"
            />
            <el-table-column
                label="设备分级"
                prop="facilityLevel"
                align="center"
                width="66"
            />
            <el-table-column
                label="规格型号"
                prop="specificationModel"
                align="center"
                width="140"
            />
            <el-table-column
                label="设备唯一识别码"
                prop="facilityNumber"
                align="center"
                width="160"
            />
            <el-table-column
                label="设备地点"
                prop="facilityLocations"
                align="center"
                width="132"
            />
            <el-table-column
                label="资产编号"
                prop="assetNumber"
                width="66"
                align="center"
            />
            <el-table-column
                label="设备状态"
                prop="facilityState"
                align="center"
                width="72"
            >
                <template #default="scope">
                    <div>{{ facilityStateName(scope.row.facilityState) }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="数量"
                prop="facilityNumbers"
                align="center"
                width="50"
            />
            <el-table-column
                label="单位"
                prop="unit"
                align="center"
                width="50"
            />
            <el-table-column
                label="供应商/厂家"
                prop="facilitySupplier"
                width="142"
                align="center"
            />
            <el-table-column
                label="是/否纳入特许经营权"
                prop="franchising"
                width="78"
                align="center"
            />
            <el-table-column
                label="采购时间"
                prop="purchaseTime"
                width="90"
                align="center"
            />
            <el-table-column
                label="开始使用时间"
                prop="startTime"
                width="90"
                align="center"
            />
            <el-table-column
                label="主要技术参数"
                prop="technicalParameter"
                width="400"
                align="center"
            />
            <el-table-column
                label="操作"
                fixed="right"
                width="105"
                align="center"
            >
                <template #default="scope">
                    <el-button
                        type="primary"
                        size="small"
                        @click="handleDetail(scope.row)"
                    >巡检记录</el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
            v-model:current-page="searchForm.pageNo"
            v-model:page-size="searchForm.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :page-sizes="[10, 20, 50, 100, 200]"
            :total="total"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            class="paginationStyle"
        />
    </div>
    <el-dialog
        v-model="recordListVisible"
        title="巡检记录"
        width="1100"
    >
        <div style="margin: 0px 20px 0">
            <el-row :gutter="20">
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备名称：</label>
                        <span>{{ currentRowDate.facilityName }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">唯一识别码：</label>
                        <span>{{ currentRowDate.facilityNumber }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">设备状态：</label>
                        <span>{{
                            currentRowDate.facilityState == "1"
                                ? "在用"
                                : "停用"
                        }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">所属单位：</label>
                        <span>{{
                            depNameTranslate(currentRowDate.depId)
                        }}</span>
                    </div>
                </el-col>
                <el-col :span="8">
                    <div class="grid-content">
                        <label for="">规格型号：</label>
                        <span>{{ currentRowDate.specificationModel }}</span>
                    </div>
                </el-col>
                <el-col :span="24">
                    <div class="grid-content">
                        <label for="">主要技术参数：</label>
                        <span>{{ currentRowDate.technicalParameter }}</span>
                    </div>
                </el-col>
                <el-col :span="24">
                    <div
                        class="grid-content"
                        style="text-align: right"
                    >
                        <label for="">巡检时间：</label>

                        <el-date-picker
                            v-model="currentMonth"
                            type="month"
                            placeholder="选择月份"
                            :size="'small'"
                            style="width: 100px"
                        />
                    </div>
                </el-col>
            </el-row>
        </div>

        <el-table
            :data="tableDataOne"
            border
            style="margin-top: 10px"
        >
            <el-table-column
                prop="name"
                label="一级巡检项目内容"
            />
            <el-table-column
                v-for="item in currentMonthDays"
                :prop="item + ''"
                :key="item + ''"
                :label="item + ''"
                width="24"
            >
                <template #default="scope">
                    <div v-if="isPhotoUrl(scope.row[item])"></div>
                    <div v-else>
                        {{
                            scope.row[item] == "正常"
                                ? "√"
                                : scope.row[item] == "异常"
                                ? "×"
                                : scope.row[item]
                        }}
                    </div>
                </template>
            </el-table-column>
        </el-table>
        <el-table
            :data="tableDataTwo"
            border
            style="margin-top: 10px"
        >
            <el-table-column
                prop="name"
                label="二级巡检项目内容"
            />
            <el-table-column
                v-for="item in currentMonthDays"
                :prop="item + ''"
                :key="item + ''"
                :label="item + ''"
                width="24"
            >
                <template #default="scope">
                    <div v-if="isPhotoUrl(scope.row[item])"></div>
                    <div v-else>
                        {{
                            scope.row[item] == "正常"
                                ? "√"
                                : scope.row[item] == "异常"
                                ? "×"
                                : scope.row[item]
                        }}
                    </div>
                </template>
            </el-table-column>
        </el-table>
        <el-table
            :data="tableDataThree"
            border
            style="margin-top: 10px"
        >
            <el-table-column
                prop="name"
                label="三级巡检项目内容"
            />
            <el-table-column
                v-for="item in currentMonthDays"
                :prop="item + ''"
                :key="item + ''"
                :label="item + ''"
                width="24"
            >
                <template #default="scope">
                    <div v-if="isPhotoUrl(scope.row[item])"></div>
                    <div v-else>
                        {{
                            scope.row[item] == "正常"
                                ? "√"
                                : scope.row[item] == "异常"
                                ? "×"
                                : scope.row[item]
                        }}
                    </div>
                </template>
            </el-table-column>
        </el-table>
        <template #footer>
            <div
                class="dialog-footer"
                style="text-align: center;"
            >
                <!-- <el-button @click="recordListVisible = false">取消</el-button> -->
                <el-button
                    type="primary"
                    @click="exportInspRecord"
                >
                    导出
                </el-button>
            </div>
        </template>
    </el-dialog>
    <el-dialog
        v-model="exportInspRecordListVisible"
        title="导出记录"
        width="900"
    >
        <template #header>
            <div
                class="my-header"
                style="font-size: 18px"
            >
                导出记录<span style="font-size: 14px"> (每月初自动生成上月巡检记录表，请自行下载)</span>
            </div>
        </template>
        <div class="filter">
            <div class="filter-item">
                <label for="">所属单位：</label>
                <el-select
                    v-model="exportInspRecordForm.depId"
                    class="m-2"
                    placeholder="请选择所属单位"
                    style="width: 145px"
                    :disabled="localTypeUnit != '1'"
                    @change="depIdChange"
                >
                    <el-option
                        v-for="item in depIdList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                </el-select>
            </div>
            <div class="filter-item">
                <label for="">导出月份：</label>
                <el-date-picker
                    v-model="exportInspRecordForm.exportMonth"
                    type="month"
                    placeholder="选择月份"
                    style="width: 145px"
                />
            </div>
            <div class="filter-item">
                <label for="">导出状态：</label>
                <el-select
                    v-model="exportInspRecordForm.status"
                    class="m-2"
                    placeholder="请选择设备状态"
                    style="width: 145px"
                >
                    <el-option
                        v-for="item in exportInspRecordStatus"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                    />
                </el-select>
            </div>
            <div class="filter-item">
                <el-button
                    type="primary"
                    @click="exportInspRecordList"
                >查询</el-button>
            </div>
            <div class="filter-item">
                <el-button
                    type="primary"
                    @click="exportInspRecordListReset"
                >重置</el-button>
            </div>
        </div>
        <el-table
            ref="singleTableRef"
            :data="exportInspRecordDataList"
            style="width: 100%"
            :height="hHeight - 40 + 'px'"
        >
            <el-table-column
                type="index"
                label="序号"
                width="55"
                align="center"
            />
            <el-table-column
                label="所属单位"
                prop="depId"
                align="center"
            >
                <template #default="scope">
                    <div>{{ depIdName(scope.row.depId) }}</div>
                </template>
            </el-table-column>
            <el-table-column
                label="导出月份"
                prop="exportMonth"
                align="center"
            />
            <el-table-column
                label="附件"
                prop="fileName"
                align="center"
            />
            <el-table-column
                label="导出状态"
                prop="status"
                align="center"
            >

                <template #default="scope">{{ scope.row.status == 0 ? '未生成' : scope.row.status == 1 ? '已生成' :  '生成失败' }}</template>
            </el-table-column>
            <el-table-column
                label="操作"
                fixed="right"
                width="105"
                align="center"
            >
                <template #default="scope">
                    <el-button
                        type="primary"
                        size="small"
                        :disabled="scope.row.status != '1'"
                        @click="handleItemExport(scope.row)"
                    >下载</el-button>
                </template>
            </el-table-column>
        </el-table>

        <el-pagination
            v-model:current-page="exportInspRecordForm.pageNo"
            v-model:page-size="exportInspRecordForm.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :page-sizes="[10, 20, 50, 100, 200]"
            :total="exportInspRecordTotal"
            @size-change="exportInspRecordHandleSizeChange"
            @current-change="exportInspRecordHandleCurrentChange"
            class="paginationStyle"
        />
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="exportInspRecordListVisible = false">取消</el-button>
            </div>
        </template>
    </el-dialog>
</template>
  
  <script setup>
import equipmentHttp from "@/https/equipment.js";
import labelHttp from "@/https/label.js";
import schedulingHttp from "@/https/scheduling.js";
import Storage from "@/utils/storage.js"; // storage工具类，简单的封装
import moment from "moment";
import { nextTick, onMounted, reactive, ref, watch } from "vue";
const currentMonth = ref(new Date());
const currentMonthDays = ref(0);
currentMonthDays.value = moment(currentMonth.value, "YYYY-MM").daysInMonth();
let searchForm = reactive({
    assetNumber: "",
    depId: "",
    facilityLevel: "",
    facilityLocations: "",
    facilityName: "",
    facilityNumber: "",
    facilitySort: "",
    facilityState: "",
    facilitySupplier: "",
    specificationModel: "",
    hasInspPlan: "",
    tagName: "",
    pageNo: 1,
    pageSize: 10,
});
const localTypeUnit = ref(Storage.localGet("depId"));
searchForm.depId = localTypeUnit.value;
let equipmentOverview = ref({});
const depIdList = ref([
    { label: "全部", value: "1" },
    { label: "星沙厂", value: "2" },
    { label: "城西厂", value: "3" },
    { label: "城北厂", value: "4" },
    { label: "城南厂", value: "5" },
    { label: "城东厂", value: "6" },
]);
const batchAdddepIdList = ref([
    { label: "星沙厂", value: "2" },
    { label: "城西厂", value: "3" },
    { label: "城北厂", value: "4" },
    { label: "城南厂", value: "5" },
]);
const inspectionPlanList = ref([
    { label: "全部", value: "" },
    { label: "有巡检计划", value: "1" },
    { label: "无巡检计划", value: "0" },
]);
const depIdName = (id) => {
    return id == "1"
        ? "公司"
        : id == "2"
            ? "星沙厂"
            : id == "3"
                ? "城西厂"
                : id == "4"
                    ? "城北厂"
                    : id == "5"
                        ? "城南厂"
                        : "城东厂";
};
const facilityStateName = (id) => {
    return id == "1"
        ? "在用"
        : id == "2"
            ? "备用"
            : id == "3"
                ? "维修"
                : id == "4"
                    ? "报废"
                    : "其他";
};
const facilityLevelList = ref([
    { label: "全部", value: "" },
    { label: "A", value: "A" },
    { label: "B", value: "B" },
    { label: "C", value: "C" },
    { label: "其他", value: "其他" },
]);
const facilitySortList = ref([]);
const facilityStateList = ref([
    { label: "在用", value: "1" },
    { label: "备用", value: "2" },
    { label: "维修", value: "3" },
    { label: "报废", value: "4" },
    { label: "其他", value: "5" },
]);

const depNameTranslate = (depId) => {
    let depName = "";
    depIdList.value.forEach((item) => {
        if (item.value == depId) {
            depName = item.label;
        }
    });
    return depName;
};
const dataList = ref([]);

const depIdChange = () => {
    searchForm.facilitySort = "";
    searchForm.tagName = ''
    getFacilitySort();
    getBatchlabelListSelect();
};

const hHeight = ref(0);
onMounted(() => {
    hHeight.value = document.documentElement.clientHeight - 350;
    search();
    getFacilitySort();
    getBatchlabelListSelect();
});
const labelList = ref([])
const getBatchlabelListSelect = async () => {
    let params = {
        depId: searchForm.depId == '1' ? '' : searchForm.depId,
        tagName: "",
        pageNo: 1,
        pageSize: 10000,
    }
    const res = await labelHttp.tagPageList(params);
    if (res.data.code === 200) {
        labelList.value = res.data.data.records;
    }
}
const getFacilitySort = () => {
    equipmentHttp.getFacilitySort(searchForm.depId).then((res) => {
        facilitySortList.value = [];
        res.data.data.forEach((item) => {
            facilitySortList.value.push({
                label: item,
                value: item,
            });
        });
    });
};
const facilitySituation = () => {
    equipmentHttp.facilitySituation(searchForm.depId).then((res) => {
        if (res.data.code == 200) {
            console.log(res.data);
            nextTick(() => {
                equipmentOverview.value = res.data.data;
            });
        }
    });
};
let total = ref(0);
const handleSizeChange = (val) => {
    searchForm.pageSize = val;
    search();
};
const handleCurrentChange = (val) => {
    searchForm.pageNo = val;
    search();
};
const search = () => {
    equipmentHttp.queryFacility(searchForm).then((res) => {
        if (res.data.code == 200) {
            dataList.value = res.data.data.records;
            total.value = res.data.data.total;
        }
    });
    facilitySituation();
};
let recordListVisible = ref(false);
const currentRowDate = ref({});

const tableDataOne = ref([]);
const tableDataTwo = ref([]);
const tableDataThree = ref([]);

watch(currentMonth, (val) => [
    (currentMonthDays.value = moment(val, "YYYY-MM").daysInMonth()),
]);
const handleDetail = async (row) => {
    recordListVisible.value = true;
    currentRowDate.value = row;
    let params = {
        id: row.id,
        inspDate: moment(currentMonth.value).format("YYYY-MM"),
    };
    const res = await schedulingHttp.inspTaskQueryInspRecord(params);
    if (res.data.code == 200) {
        console.log(res.data.data);
        let oneArr = [];
        let oneArrName = [];
        let twoArr = [];
        let twoArrName = [];
        let threeArr = [];
        let threeArrName = [];
        res.data.data.forEach((item) => {
            console.log(oneArrName, "oneArrName");
            if (item.itemLevelOne) {
                let itemLevelOneObj = JSON.parse(item.itemLevelOne);
                console.log(itemLevelOneObj, "obj");
                Object.keys(itemLevelOneObj).forEach(function (key) {
                    console.log(key + ": " + itemLevelOneObj[key]);
                    if (oneArrName.includes(key)) {
                        oneArr.forEach((k) => {
                            if (k.name == key) {
                                k[item.inspDate] = itemLevelOneObj[key];
                            }
                        });
                    } else {
                        oneArrName.push(key);
                        oneArr.push({
                            name: key,
                            [item.inspDate]: itemLevelOneObj[key],
                        });
                    }
                });
            }
            if (item.itemLevelTwo) {
                let itemLevelTwoObj = JSON.parse(item.itemLevelTwo);
                console.log(itemLevelTwoObj, "obj");
                Object.keys(itemLevelTwoObj).forEach(function (key) {
                    console.log(key + ": " + itemLevelTwoObj[key]);
                    if (twoArrName.includes(key)) {
                        twoArr.forEach((k) => {
                            if (k.name == key) {
                                k[item.inspDate] = itemLevelTwoObj[key];
                            }
                        });
                    } else {
                        twoArrName.push(key);
                        twoArr.push({
                            name: key,
                            [item.inspDate]: itemLevelTwoObj[key],
                        });
                    }
                });
            }
            if (item.itemLevelThree) {
                let itemLevelThreeObj = JSON.parse(item.itemLevelThree);
                console.log(itemLevelThreeObj, "obj");
                Object.keys(itemLevelThreeObj).forEach(function (key) {
                    console.log(key + ": " + itemLevelThreeObj[key]);
                    if (threeArrName.includes(key)) {
                        threeArr.forEach((k) => {
                            if (k.name == key) {
                                k[item.inspDate] = itemLevelThreeObj[key];
                            }
                        });
                    } else {
                        threeArrName.push(key);
                        threeArr.push({
                            name: key,
                            [item.inspDate]: itemLevelThreeObj[key],
                        });
                    }
                });
            }
        });
        if (oneArr.length > 0) {
            oneArr.push({
                name: "现场图片",
            });
            oneArr.push({
                name: "巡检人",
            });
        }
        if (twoArr.length > 0) {
            twoArr.push({
                name: "现场图片",
            });
            twoArr.push({
                name: "巡检人",
            });
        }
        if (threeArr.length > 0) {
            threeArr.push({
                name: "现场图片",
            });
            threeArr.push({
                name: "巡检人",
            });
        }
        res.data.data.forEach((item) => {
            if (item.imagePathOne) {
                oneArr[oneArr.length - 2][item.inspDate] = item.imagePathOne;
            }
            if (item.imagePathTwo) {
                twoArr[twoArr.length - 2][item.inspDate] = item.imagePathTwo;
            }
            if (item.imagePathThree) {
                threeArr[threeArr.length - 2][item.inspDate] =
                    item.imagePathThree;
            }
            if (item.inspUserOne) {
                oneArr[oneArr.length - 1][item.inspDate] = item.inspUserOne;
            }
            if (item.inspUserTwo) {
                twoArr[twoArr.length - 1][item.inspDate] = item.inspUserTwo;
            }
            if (item.inspUserThree) {
                threeArr[threeArr.length - 1][item.inspDate] =
                    item.inspUserThree;
            }
        });
        console.log(oneArr, "oneArr");
        tableDataOne.value = oneArr;
        tableDataTwo.value = twoArr;
        tableDataThree.value = threeArr;
        // tableData.value = res.data.data;
    }
};
const exportInspRecord = async () => {
    let params = {
        equipId: currentRowDate.value.id,
        exportMonth: moment(currentMonth.value).format("YYYY-MM"),
    };
    schedulingHttp.inspTaskExportInspRecord(params).then((response) => {
        console.log(response);
        const content = response.data;
        const blob = new Blob([content], { type: "application/ms-excel" });
        let fileName = `巡检记录.xls`;
        if ("download" in document.createElement("a")) {
            // 非IE下载
            const elink = document.createElement("a");
            elink.download = fileName;
            elink.style.display = "none";
            elink.href = URL.createObjectURL(blob);
            document.body.appendChild(elink);
            elink.click();
            URL.revokeObjectURL(elink.href); // 释放URL 对象
            document.body.removeChild(elink);
        } else {
            // IE10+下载
            navigator.msSaveBlob(blob, fileName);
        }
    });
}
const handleItemExport = async (row) => {
    schedulingHttp.inspRecordExportDownload(row.id).then((response) => {
        console.log(response);
        const content = response.data;
        const blob = new Blob([content], { type: "application/zip" });
        let fileName = `巡检记录.zip`;
        if ("download" in document.createElement("a")) {
            // 非IE下载
            const elink = document.createElement("a");
            elink.download = fileName;
            elink.style.display = "none";
            elink.href = URL.createObjectURL(blob);
            document.body.appendChild(elink);
            elink.click();
            URL.revokeObjectURL(elink.href); // 释放URL 对象
            document.body.removeChild(elink);
        } else {
            // IE10+下载
            navigator.msSaveBlob(blob, fileName);
        }
    });
}
const exportInspRecordListVisible = ref()
const exportInspRecordDataList = ref([])
const exportInspRecordTotal = ref(0)
const exportInspRecordForm = ref({
    depId: '',
    exportMonth: moment().format('YYYY-MM'),
    pageNo: 1,
    pageSize: 10,
    status: '',
})

const exportInspRecordStatus = ref([
    { label: "未生成", value: "0" },
    { label: "已生成", value: "1" },
    { label: "生成失败", value: "-1" },
]);

const exportInspRecordListReset = async () => {
    exportInspRecordForm.value.depId = ''
    exportInspRecordForm.value.exportMonth = moment().format('YYYY-MM')
    exportInspRecordForm.value.pageNo = 1
    exportInspRecordForm.value.pageSize = 10
    exportInspRecordForm.value.status = ''
    exportInspRecordList()
}
const exportInspRecordList = async () => {
    exportInspRecordListVisible.value = true
    let params = { ...exportInspRecordForm.value, exportMonth: moment(exportInspRecordForm.value.exportMonth).format('YYYY-MM') };

    const res = await schedulingHttp.inspTaskExportTaskList(params);
    if (res.data.code == 200) {
        exportInspRecordDataList.value = res.data.data.records
    }
}

const exportInspRecordHandleSizeChange = (val) => {
    exportInspRecordForm.pageSize = val;
    exportInspRecordList();
};
const exportInspRecordHandleCurrentChange = (val) => {
    exportInspRecordForm.pageNo = val;
    exportInspRecordList();
};
function isNumber (value) {
    return /^-?\d+(\.\d+)?$/.test(value);
}
const isPhotoUrl = (url) => {
    let flag = false;
    if (url && isNumber(url)) {
        flag = true;
    }
    return flag;
};
const reset = () => {
    searchForm.assetNumber = "";
    searchForm.depId = localTypeUnit.value;
    searchForm.facilityLevel = "";
    searchForm.facilityLocations = "";
    searchForm.facilityName = "";
    searchForm.facilityNumber = "";
    searchForm.facilitySort = "";
    searchForm.facilityState = "";
    searchForm.facilitySupplier = "";
    searchForm.specificationModel = "";
    searchForm.tagName = ''
    searchForm.pageNo = 1;
    searchForm.pageSize = 10;
    search();
};
watch(currentMonth, (val) => {
    handleDetail(currentRowDate.value);
});
</script>
  
  <style scoped lang="less">
.filter {
    flex-wrap: wrap;
    display: flex;
    flex-direction: row;
    align-items: center;
    .filter-item {
        margin: 0 15px 15px 0px;
        display: flex;
        flex-direction: row;
        align-items: center;
        label {
            font-size: 14px;
            color: #333;
            display: inline-block;
            white-space: nowrap;
        }
    }
}
.options {
    margin: 20px 0 15px;
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    .ml-2 {
        margin-right: 10px;
    }
}
.preview {
    display: flex;
    flex-direction: row;
    align-items: center;
}
.equipmentPagination {
    justify-content: flex-end;
    margin-top: 10px;
}
.grid-content {
    line-height: 2;
}
.dataList {
    :deep .el-table__header .cell {
        padding-left: 2px !important;
        padding-right: 2px !important;
    }
    :deep .el-table__cell {
        padding: 0 !important;
    }
    :deep .el-table__cell .cell {
        padding: 0 !important;
        font-size: 12px;
        text-align: center;
    }
}
</style>
  